<template>
	<scroll-view scroll-y>
		<checkbox-group @change="handleSelectRoomChange">
			<block 
				v-for="item in handledRoomList[regionActive].children" 
				:key="item._id"
			>
				<roomCardVue :room="item">
					<checkbox 
						shape="square" 
						:value="item._id" 
						:checked="item.checked" 
						:disabled="item.disabled" 
						style="transform:scale(1.3)"
						color="#004EA2" />
				</roomCardVue>
			</block>
		</checkbox-group>
	</scroll-view>
</template>

<script>
	import {mapGetters} from 'vuex'
	import roomCardVue from './room-card.vue'
	
	export default {
		name: 'select-region-room-wrap',
		components: {
			roomCardVue
		},
		props: ['regionActive'],
		computed: {
			...mapGetters(['handledRoomList']),
		},
		methods: {
			handleSelectRoomChange({detail = {}}) {
				this.$emit('onChange', detail.value)
			},
		}
	}
</script>

<style lang="scss">
</style>